<HTML>
  <HEAD>
    <META http-equiv="Content-Type" content="text/html; charset=utf-8">
    <META name="GENERATOR" content="BLOCKNOTE.NET">
    <BASEFONT face="Verdana" size=2>
    <TITLE></TITLE><STYLE>BODY { FONT-FAMILY:Verdana; FONT-SIZE:10pt; background-color:#fffeef }
P { FONT-FAMILY:Verdana; FONT-SIZE:10pt }
DIV { FONT-FAMILY:Verdana; FONT-SIZE:10pt }

span.progress 
{
  padding-left:24px;
  display:inline-block;
  foreground-image: url(progress.gif);
  foreground-repeat: no-repeat;
  foreground-position:2px 50%;
  width:10em;
  line-height:24px;
  border: 1px solid black;
}
span.progress > span.caption:hover
{
  color:red;
}


</STYLE>
  </HEAD>
<BODY>

<p>Here is an example <span class="progress"><span class="caption">100%</span></span> of 
inline block with animation and with one inner caption block.</p>
<p>This inner caption block is set to be overflow:hidden; so changes (e.g. UpdateElement)
will not affect its container the one with animated images</p>
</BODY>
</HTML>